<%@ page language="java"  pageEncoding="UTF-8"%>
<%@ include file="/views/commons/taglibs.jsp" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style"/>
		<meta content="telephone=no" name="format-detection"/>
<title>我的兑换码</title>

<link href="<%=path%>/css/stlye.css" rel="stylesheet" type="text/css" />
<style>
	input{
     width:80%;
	 height:2.8rem;
	 font-size:1.5rem;
	 line-height:3rem;
	 text-align:center;
	 margin:0 auto;
	 background-color:#fff;
     border-radius:15px;
	 border:none;
	 }
</style>
<script src="<%=path%>/js/jquery-1.11.0.min.js"></script>
<script src="<%=path%>/js/plugins/layer/layer.js"></script>	
<script type="text/javascript">
	$(function () {
		var el = document.createElement("STYLE");
		var docEl = document.documentElement;
		var portrait = ((Math.min(docEl.clientWidth, docEl.clientHeight) / 320) * 10);
		var landscape = ((Math.max(docEl.clientWidth, docEl.clientHeight) / 568) * 17.75);
		el.innerHTML = "@media screen and (orientation:portrait) { html { font-size: " + portrait + "px!important; } }\n@media screen and (orientation:landscape) { html { font-size: " + landscape + "px!important; } }";
		docEl.firstElementChild.appendChild(el);		
	});
	
	$(document).ready(function(){
		$("TEXTAREA,input[focucmsg]") .each (function(){
			$(this).val($(this).attr("focucmsg"));
			$(this).val($(this).attr("focucmsg")).css("color","#979393");
			$(this).focus(function(){
				if($(this).val() == $(this).attr("focucmsg")){
					$(this).val('');
					$(this).val('').css("color","#6b6969");
				}
			});
			$(this).blur(function(){
				if(!$(this).val()){
					$(this).val($(this).attr("focucmsg"));
					$(this).val($(this).attr("focucmsg")).css("color","#979393");
				}
			});
		});
	});
	
	function exchangeCoupon(){
		var couponNo=$("#coupon_no").val();
		
		if(couponNo==null||couponNo==''){
			layer.msg("请输入兑换码",{icon: 2});
			return;
		}
		
		$.ajax({
			url : "<%=path %>/check/coupon/doExchange",
			type : "get",
			dataType : "json",
			data :{
				couponNo:$("#coupon_no").val()
			},
			success : function(data)
			{
				if(data.result){
					if(data.subscribe==1){
						$("#attention_a").hide();
					}else{
						$("#attention_a").show();
					}
					$("#coupon_goods_div").html(data.goodsMsg);
					$("#use_a").attr('onclick',"viewGood('"+data.goodsUrl+"')");
					$("#success_div").show();
				}else{
					layer.msg(data.message,{icon: 2});
				}
			},error:function(){
				layer.msg("服务器网络繁忙",{icon: 2});
			}
		});
	}
	
	function closeResult(){
		$("#success_div").hide();
	}
	
	function toAttention(){
		window.location.href="<%=path%>/views/html5/attention.jsp";
	}
	
	function viewGood(goodsUrl){
		window.location.href=goodsUrl;
	}
</script>
</head>
<body style="background-color:#eae1ba;">
<div class="wodeduihuanma"><img src="<%=path%>/images/bg_3.png" width="100%" height="" />
 
</div>
<div class="duihuanm1">
<input name="couponNo" id="coupon_no" type="text" value="请输入您的兑换码"  focucmsg="请输入您的兑换码"  style="height:2.8rem; width:100%; line-height:2.8rem;" /> 
</div>

<div class="querenbuttom1" onclick="javascript:exchangeCoupon()">立即兑换</div>

<div class="eject" id="success_div" style="display: none;">
	<div class="wk">
	   <div class="hb"></div>
	   <div class="gongxi">恭喜您，兑换成功</div>
	   <div class="leixing" id="coupon_goods_div">礼券类型：单品-真皮女款手表</div>
	   <div class="lijishiyong" id="use_a">立即使用</div>
	   <div class="guanzhuwomen" id="attention_a"  onclick="toAttention()">关注我们</div>
	   <div class="x" onclick="closeResult()"><img src="<%=path%>/images/x.png" width="100%" height="" /></div>
	</div>
</div>
<jsp:include page="/views/html5/commons/footer.jsp"></jsp:include>
</body>
</html>
